@extends('layouts/app')

@section('content')
    <div class="order-list ">
        @csrf
        <!-- 容器 -->
        <ul class="nav-tabs list-unstyled row">
            <li class="pull-left f30"><a href="javascript:;" class="active" data-type="" data-id="#1">全部</a></li>
            <li class="pull-left f30"><a href="javascript:;" data-type="2" data-id="#2">支付成功</a></li>
            <li class="pull-left f30"><a href="javascript:;" data-type="3" data-id="#3">进行中</a></li>
            <li class="pull-left f30"><a href="javascript:;" data-type="4" data-id="#4">已完成</a></li>
            <li class="pull-left f30"><a href="javascript:;" data-type="-1" data-id="#5">退款/售后</a></li>
        </ul>

        <div class="tab-content white-bg">
            <div class="tab-pane active" id="1">
                <ul class="orders-list">
                    {{--<li class="row">--}}
                        {{--<div class="col-3">--}}
                            {{--<div class="img">--}}
                                {{--<img src="/img/eat.png" alt="" class="img-responsive">--}}
                            {{--</div>--}}
                        {{--</div>--}}
                        {{--<div class="col-9">--}}
                            {{--<div class="text">--}}
                                {{--<a href="/mobile/order-detail">--}}
                                    {{--<h3 class="f30">标题 <span class="pull-right f20">已完成</span></h3>--}}
                                    {{--<p class="f20 gary6">下单时间：2018-07-09</p>--}}
                                    {{--<p class="f20 gary6">总价：￥ 168.00</p>--}}
                                {{--</a>--}}
                            {{--</div>--}}
                            {{--<div class="btn row">--}}
                                {{--<a href="" class="order-btn f24">再来一单</a>--}}
                                {{--<a href="" class="message-btn f24">评价菜单</a>--}}
                            {{--</div>--}}
                        {{--</div>--}}
                    {{--</li>--}}
                    {{--<li class="row">--}}
                        {{--<div class="col-3">--}}
                            {{--<div class="img">--}}
                                {{--<img src="/img/eat.png" alt="" class="img-responsive">--}}
                            {{--</div>--}}
                        {{--</div>--}}
                        {{--<div class="col-9">--}}
                            {{--<div class="text">--}}
                                {{--<a href="/mobile/order-detail">--}}
                                {{--<h3 class="f30">标题 <span class="pull-right f20">已完成</span></h3>--}}
                                {{--<p class="f20 gary6">下单时间：2018-07-09</p>--}}
                                {{--<p class="f20 gary6">总价：￥ 168.00</p>--}}
                                {{--</a>--}}
                            {{--</div>--}}
                            {{--<div class="btn row">--}}
                                {{--<a href="" class="order-btn f24">再来一单</a>--}}
                                {{--<a href="" class="message-btn f24">评价菜单</a>--}}
                            {{--</div>--}}
                        {{--</div>--}}
                    {{--</li>--}}
                </ul>
                <div>
                    <div class="weui-infinite-scroll hasdata">
                        <div class="infinite-preloader"></div>
                        <div class="weui-loadmore">
                            <i class="weui-loading"></i>
                            <span class="weui-loadmore__tips">正在加载</span>
                        </div>
                    </div>
                    <div class="weui-infinite-scroll nodata">
                        <div class="weui-loadmore weui-loadmore_line">
                            <span class="weui-loadmore__tips">没有更多了</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="tab-pane" id="2">
                <ul class="orders-list">

                </ul>
                <div>
                    <div class="weui-infinite-scroll hasdata">
                        <div class="infinite-preloader"></div>
                        <div class="weui-loadmore">
                            <i class="weui-loading"></i>
                            <span class="weui-loadmore__tips">正在加载</span>
                        </div>
                    </div>
                    <div class="weui-infinite-scroll nodata">
                        <div class="weui-loadmore weui-loadmore_line">
                            <span class="weui-loadmore__tips">没有更多了</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="tab-pane" id="3">
                <ul class="orders-list">

                </ul>
                <div>
                    <div class="weui-infinite-scroll hasdata">
                        <div class="infinite-preloader"></div>
                        <div class="weui-loadmore">
                            <i class="weui-loading"></i>
                            <span class="weui-loadmore__tips">正在加载</span>
                        </div>
                    </div>
                    <div class="weui-infinite-scroll nodata">
                        <div class="weui-loadmore weui-loadmore_line">
                            <span class="weui-loadmore__tips">没有更多了</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="tab-pane" id="4">
                <ul class="orders-list">

                </ul>
                <div>
                    <div class="weui-infinite-scroll hasdata">
                        <div class="infinite-preloader"></div>
                        <div class="weui-loadmore">
                            <i class="weui-loading"></i>
                            <span class="weui-loadmore__tips">正在加载</span>
                        </div>
                    </div>
                    <div class="weui-infinite-scroll nodata">
                        <div class="weui-loadmore weui-loadmore_line">
                            <span class="weui-loadmore__tips">没有更多了</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="tab-pane" id="5">
                <ul class="orders-list">

                </ul>
                <div>
                    <div class="weui-infinite-scroll hasdata">
                        <div class="infinite-preloader"></div>
                        <div class="weui-loadmore">
                            <i class="weui-loading"></i>
                            <span class="weui-loadmore__tips">正在加载</span>
                        </div>
                    </div>
                    <div class="weui-infinite-scroll nodata">
                        <div class="weui-loadmore weui-loadmore_line">
                            <span class="weui-loadmore__tips">没有更多了</span>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>

    <script>

        function initPage(type, ele) {
            AjaxPage.init({
                url: '/api/user/myOrder',    //路径
                cElement: '.tab-content ' + ele,    // 滚动容器
                element: ele + ' .orders-list',    // 列表容器
                type: 'orderList',      //渲染类型
                total: 0,   // 总记录条数
                loading: !1, // 加载状态
                arg: {      // 请求参数
                    page: 1,
                    limit: 8,
                    type: type
                }
            });

        }

        initPage('', '#1');

        // 菜单切换
        $(".order-list .nav-tabs a").click(function () {
            var type = $(this).attr("data-type"),
            element = $(this).attr("data-id");

            // 在创建数据前先把容器置空
            $(element + ' .orders-list').html('');
            // 初始化数据
            initPage(type, element);
        });

//        api/user/deleteOrder
//        传id
//        删除订单

        $(".orders-list").on("click", ".del", function () {
            console.log("我要删除");
            var id = $(this).attr("data-id");
            console.log("id", id);

            $.post("/api/user/deleteOrder", {id: id}, function (res) {
                if (typeof res === 'string') {
                    res = JSON.parse(res);
                }

                $.alert(res.info, function () {
                    if (res.code == 200) {
                        location.reload();
                    }
                });
            });
        });
    </script>
@endsection


@extends('layouts/footer')
